<template>
  <div>
    <el-row>
      <el-col :span="24"><div class="grid-content bg-purple" style="text-align: center">
        <h2>采购信息查询</h2>
      </div></el-col>
    </el-row>
    <br>
    <Template :tableinfo="tableinfo" :tablebutton="tablebutton" :totalmsg="totalmsg" :tabledate="tabledate" @init="init" identity="Buyinfo"></Template>
    <div style="float: right;width: 350px;height: 300px;margin-top: 40px;margin-right: 100px">
      <el-card class="box-card loginCl">
        <div slot="header" class="clearfix">
          <h3 style="align-content: center;text-align: center">查询采购信息</h3>
        </div>
        <div class="text item">
          <el-form :model="ruleForm" status-icon ref="ruleForm" label-width="100px" class="demo-ruleForm">
            <el-row class="row-class">
              <el-col :span="24"><div class="grid-content bg-purple-light">
                <el-form-item label="供应商" prop="username">
                  <el-input v-model.number="ruleForm.providername"></el-input>
                </el-form-item>
              </div>
              </el-col>
            </el-row>
            <el-row class="row-class">
              <el-col :span="24"><div class="grid-content bg-purple-light">
                <el-form-item label="起始日期" prop="password">
                  <el-input type="date" v-model="ruleForm.starttime" autocomplete="off"></el-input>
                </el-form-item>
              </div>
              </el-col>
            </el-row>
            <el-row class="row-class">
              <el-col :span="24"><div class="grid-content bg-purple-light">
                <el-form-item label="结束日期" prop="password">
                  <el-input type="date" v-model="ruleForm.endtime" autocomplete="off"></el-input>
                </el-form-item>
              </div>
              </el-col>
            </el-row>

            <div>
              <el-form-item style="align-content: center;text-align: center">
                <el-button type="primary" @click="select">查询</el-button>
              </el-form-item>
            </div>
          </el-form>
        </div>
      </el-card>
    </div>
  </div>
</template>

<script>
import Template from "@/components/Template";

export default {
  // eslint-disable-next-line vue/multi-word-component-names
  name: "BuyInfo",
  components:{
    // eslint-disable-next-line vue/no-unused-components
    Template
  },
  data(){
    return{
      tableinfo:[['采购时间','buyTime'],['供应商名称','providerName'],['采购员','buyPerson']],
      tablebutton:['查看采购详情'],

      tabledate:[],
      totalmsg:10,

      selectOS:false,

      ruleForm:{
        providername:'',
        starttime:'1990-01-01',
        endtime:'2099-12-30'
      }
    }
  },
  methods:{
    init(pageNum,pageSize){
      let url = ''
      if (this.selectOS == true){
        url = "apj/buyinfo/selectByProviderAndTime"
        let fd = new FormData
        fd.append("pageNum",pageNum)
        fd.append("pageSize",pageSize)
        fd.append("name",this.ruleForm.providername)
        fd.append("startTime",this.ruleForm.starttime)
        fd.append("endTime",this.ruleForm.endtime)
        this.$axios.post(url,fd).then(r=>{
          let msg = r.data
          this.totalmsg = msg.count
          this.tabledate = msg.list
        })
      }else{
        url = "apj/buyinfo/selectBuyInfo/"+pageNum+"/"+pageSize
        this.$axios.get(url).then(r=>{
          let msg = r.data
          this.totalmsg = msg.count
          this.tabledate = msg.list
        })
      }
    },
    select(){
      this.selectOS = true
      this.init(1,4)
    }
  }
}
</script>

<style scoped>

</style>